<template>
  <div class="tabContainer">
    <cao-zuo-shou-ce v-if="pageName === hoverPagesData.CAOZUOSHOUCE.NAME"/>
    <gui-zhang-zhi-du v-if="pageName === hoverPagesData.GUIZHANGZHIDU.NAME"/>
    <qi-ta v-if="pageName === hoverPagesData.QITA.NAME"/>
    <qi-ta-zi-liao v-if="pageName === hoverPagesData.QITAZILIAO.NAME"/>
    <qi-xuan-zi-liao v-if="pageName === hoverPagesData.QIXUANZILIAO.NAME"/>
  </div>
</template>

<script>
import CaoZuoShouCe from "./CaoZuoShouCe";
import GuiZhangZhiDu from "./GuiZhangZhiDu";
import QiTa from "./QiTa";
import QiTaZiLiao from "./QiTaZiLiao";
import QiXuanZiLiao from "./QiXuanZiLiao";
import TabVariable from '../pubVariable'
export default {
  name: "HoverPages",
  props:{
    pageName:{
      type:String
    }
  },
  data() {
    return {
      hoverPagesData:TabVariable
    }
  },
  components: {
    CaoZuoShouCe,
    GuiZhangZhiDu,
    QiTa,
    QiTaZiLiao,
    QiXuanZiLiao,
  },

};
</script>

<style lang="stylus" rel="stylesheet/stylus" scoped>
.tabContainer{
  width 345px
  margin 0 auto
  margin-top 20px
}
</style>
